<template>
    <div class="white-box">
        <div class="table-mb">
            <el-button type="primary" @click="handleAdd">新建页面</el-button>
        </div>

        <div class="task-one">
            <div class="task-one__item">
                <span class="task-one__label">页面名称：</span>
                <el-input
                    placeholder="请输入页面名称搜索"
                    v-model="search_text"
                    @keyup.enter.native="handleSearch"
                    clearable
                >
                </el-input>
            </div>
            <div class="task-one__btn clearfix">
                <el-button
                    type="primary"
                    :loading="search_btn"
                    :icon="Search"
                    @click="handleSearch"
                    >搜索</el-button
                >
            </div>
        </div>

        <el-table
            class="table-mb"
            v-loading="loading"
            :data="arr_data"
            :header-cell-style="{ background: '#F5F7FA' }"
            element-loading-background="rgba(255, 255, 255, 0.6)"
            @selection-change="handleAllSelected"
        >
            <!-- <el-table-column type="selection" width="55" /> -->
            <!-- <el-table-column prop="icId" label="id" width="100">
            </el-table-column> -->
            <el-table-column prop="title" label="名称"> </el-table-column>
            <el-table-column prop="created" label="创建时间">
            </el-table-column>
            <el-table-column prop="updated" label="更新时间">
            </el-table-column>
            <el-table-column label="操作" width="170" fixed="right">
                <template #default="{ row }">
                    <!-- <el-button  link type="primary" @click="handleEdit(row)">详情</el-button> -->
                    <el-button link type="primary" @click="handleEdit(row)"
                        >编辑</el-button
                    >
                    <el-popconfirm
                        :persistent="false"
                        title="确定删除吗？"
                        confirm-button-text="确定"
                        cancel-button-text="取消"
                        @confirm="handleDelete(row)"
						v-if="row.type!=0"
                    >
                        <template #reference>
                            <el-button
                                link
                                type="primary"
                                style="margin-left: 14px"
                                >删除</el-button
                            >
                        </template>
                    </el-popconfirm>
                </template>
            </el-table-column>
        </el-table>

        <el-pagination
            background
            v-model:current-page="page"
            v-model:page-size="pageSize"
            :page-sizes="pageSizeNum"
            :total="totalNums"
            layout="slot, sizes, prev, pager, next, jumper"
        >
            <span class="color-#606266"
                >共&nbsp;{{
                    totalNums >= 100 * pageSize
                        ? `${100 * pageSize}+`
                        : totalNums
                }}&nbsp;条</span
            >
        </el-pagination>

        <go-back />
    </div>
</template>

<script setup>
import { getCurrentInstance, ref, reactive, onMounted, watch } from "vue";
import OneLoad from "@mixins/one-load";
import MoreBtn from "@/components/MoreBtn.vue";
import { useRouter } from "vue-router";
import { Search, UploadFilled, CloseBold } from "@element-plus/icons-vue";
import GoBack from "@components/GoBack.vue";
import {
    getPageList
} from "@/apis/shop/style";

const router = useRouter();
const { proxy } = getCurrentInstance();

onMounted(() => {
    getList()
});
/**
 * minxin列表加载
 */
const {
    page,
    pageSizeNum,
    pageSize,
    loading,
    arr_data,
    totalNums,
    search_text,
    search_btn,
    pubParams,
    pubRefreshParams,
    getdata,
} = OneLoad();

// 切换每页显示条数
watch(pageSize, (val) => {
    page.value = 1;
    pubParams(getList);
});
// 跳转第几页
watch(page, (val) => {
    pubParams(getList);
});
const handleSearch = () => {
    search_btn.value = true;
    pubRefreshParams(getList);
};
function getList() {
	
    let params = {
        current: page.value,
        size: pageSize.value,
        title: search_text.value,
    };
	console.log("getList",params)
    getdata(getPageList(params));
}

const handleAdd = () => {
    router.push({
        path: "/Shop/page/pageAdd",
    });
};
const handleEdit=(row)=>{
	router.push({
	    path: "/Shop/page/pageAdd",
		query: {
		    sid:row.sid,
			pageType:row.type
		},
	});
}
</script>

<style lang="less" scoped></style>
